<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Dunzo admin is super flexible, powerful, clean &amp; modern responsive bootstrap 5 admin template with unlimited possibilities.">
    <meta name="keywords" content="admin template, Dunzo admin template, dashboard template, flat admin template, responsive admin template, web app">
    <meta name="author" content="pixelstrap">
    <link rel="icon" href="../assets/images/favicon.png" type="image/x-icon">
    <link rel="shortcut icon" href="../assets/images/favicon.png" type="image/x-icon">
    <title>Dunzo - Premium Admin Template</title>
    <!-- Google font-->
    <link href="https://fonts.googleapis.com/css?family=Outfit:400,400i,500,500i,700,700i&amp;display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900&amp;display=swap" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../assets/css/font-awesome.css">
    <!-- ico-font-->
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/icofont.css">
    <!-- Themify icon-->
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/themify.css">
    <!-- Flag icon-->
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/flag-icon.css">
    <!-- Feather icon-->
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/feather-icon.css">
    <!-- Plugins css start-->
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/slick.css">
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/slick-theme.css">
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/scrollbar.css">
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/animate.css">
    <!-- Plugins css Ends-->
    <!-- Bootstrap css-->
    <link rel="stylesheet" type="text/css" href="../assets/css/vendors/bootstrap.css">
    <!-- App css-->
    <link rel="stylesheet" type="text/css" href="../assets/css/style.css">
    <link id="color" rel="stylesheet" href="../assets/css/color-1.css" media="screen">
    <!-- Responsive css-->
    <link rel="stylesheet" type="text/css" href="../assets/css/responsive.css">
  </head>
  <body> 
    <!-- loader starts-->
    <div class="loader-wrapper">
      <div class="theme-loader">    
        <div class="loader-p"></div>
      </div>
    </div>
    <!-- loader ends-->
    <!-- tap on top starts-->
    <div class="tap-top"><i data-feather="chevrons-up"></i></div>
    <!-- tap on tap ends-->
    <!-- page-wrapper Start-->
    <div class="page-wrapper compact-wrapper" id="pageWrapper">
      <!-- Page Header Start-->
      <div class="page-header">
        <div class="header-wrapper row m-0">
          <div class="header-logo-wrapper col-auto p-0">
            <div class="logo-wrapper"><a href="index.html"><img class="img-fluid for-light" src="../assets/images/logo/logo-1.png" alt=""><img class="img-fluid for-dark" src="../assets/images/logo/logo.png" alt=""></a></div>
            <div class="toggle-sidebar">
              <svg class="sidebar-toggle"> 
                <use href="../assets/svg/icon-sprite.svg#stroke-animation"></use>
              </svg>
            </div>
          </div>
          <div class="left-header col-xxl-5 col-xl-6 col-auto box-col-6 horizontal-wrapper p-0">
            <div class="left-menu-header">
              <ul class="app-list">
                <li class="onhover-dropdown">
                  <div class="app-menu"> <i data-feather="folder-plus"></i></div>
                  <ul class="onhover-show-div left-dropdown">
                    <li> <a href="file-manager.html">File Manager</a></li>
                    <li> <a href="kanban.html"> Kanban board</a></li>
                    <li> <a href="social-app.html"> Social App</a></li>
                    <li> <a href="bookmark.html"> Bookmark</a></li>
                  </ul>
                </li>
              </ul>
              <ul class="header-left"> 
                <li class="onhover-dropdown"><span class="f-w-500">
                    <svg>
                      <use href="../assets/svg/icon-sprite.svg#fill-bonus"></use>
                    </svg>Bonus Ui</span>
                  <ul class="onhover-show-div left-dropdown">
                    <li><a href="scrollable.html">Scrollable</a></li>
                    <li><a href="tree.html">Tree view</a></li>
                    <li><a href="toasts.html">Toasts</a></li>
                    <li><a href="rating.html">Rating</a></li>
                    <li><a href="dropzone.html">dropzone</a></li>
                    <li><a href="tour.html">Tour</a></li>
                    <li><a href="sweet-alert2.html">SweetAlert2</a></li>
                    <li><a href="modal-animated.html">Animated Modal</a></li>
                    <li><a href="owl-carousel.html">Owl Carousel</a></li>
                    <li><a href="ribbons.html">Ribbons</a></li>
                    <li><a href="pagination.html">Pagination</a></li>
                    <li><a href="breadcrumb.html">Breadcrumb</a></li>
                    <li><a href="range-slider.html">Range Slider</a></li>
                    <li><a href="image-cropper.html">Image cropper</a></li>
                    <li><a href="basic-card.html">Basic Card</a></li>
                    <li><a href="creative-card.html">Creative Card</a></li>
                    <li><a href="dragable-card.html">Draggable Card</a></li>
                    <li><a href="timeline-v-1.html">Timeline</a></li>
                  </ul>
                </li>
                <li class="onhover-dropdown"><span class="f-w-500">
                    <svg>
                      <use href="../assets/svg/icon-sprite.svg#fill-Grid"></use>
                    </svg>Level Menu</span>
                  <ul class="onhover-show-div left-dropdown">
                    <li><a href="add-products.html">Add Product</a></li>
                    <li><a href="product.html">Product</a></li>
                    <li><a href="product-page.html">Product page</a></li>
                    <li><a href="list-products.html">Product list</a></li>
                    <li><a href="payment-details.html">Payment Details</a></li>
                    <li><a href="order-history.html">Order History</a></li>
                    <li><a href="invoice-template.html">Invoice</a></li>
                    <li><a href="cart.html">Cart</a></li>
                    <li><a href="list-wish.html">Wishlist</a></li>
                    <li><a href="checkout.html">Checkout</a></li>
                    <li><a href="pricing.html">Pricing  </a></li>
                  </ul>
                </li>
                <li class="onhover-dropdown"> <span class="f-w-500">
                    <svg>
                      <use href="../assets/svg/icon-sprite.svg#fill-Perk-Ui"></use>
                    </svg>Project</span>
                  <ul class="onhover-show-div left-dropdown">
                    <li><a href="projects.html">Project List</a></li>
                    <li><a href="projectcreate.html">Create new</a></li>
                  </ul>
                </li>
                <li class="onhover-dropdown p-0"><span class="f-w-500">
                    <svg>
                      <use href="../assets/svg/icon-sprite.svg#fill-bonus"></use>
                    </svg>Blog</span>
                  <ul class="onhover-show-div left-dropdown">
                    <li><a href="blog.html">Blog Details</a></li>
                    <li><a href="blog-single.html">Blog Single</a></li>
                    <li><a href="add-post.html">Add Post</a></li>
                  </ul>
                </li>
              </ul>
            </div>
          </div>
          <div class="nav-right col-xxl-7 col-xl-6 col-auto box-col-6 pull-right right-header p-0 ms-auto">
            <ul class="nav-menus">
              <li class="serchinput">
                <div class="serchbox">
                  <svg>
                    <use href="../assets/svg/icon-sprite.svg#fill-search"></use>
                  </svg>
                </div>
                <div class="form-group search-form">
                  <input type="text" placeholder="Search here...">
                </div>
              </li>
              <li>
                <div class="form-group w-100">
                  <div class="Typeahead Typeahead--twitterUsers">
                    <div class="u-posRelative d-flex">
                      <svg class="search-bg svg-color me-2">
                        <use href="../assets/svg/icon-sprite.svg#fill-search"></use>
                      </svg>
                      <input class="demo-input py-0 Typeahead-input form-control-plaintext w-100" type="text" placeholder="Search Dunzo .." name="q" title="">
                    </div>
                  </div>
                </div>
              </li>
              <li class="onhover-dropdown">
                <div class="notification-box">
                  <svg>
                    <use href="../assets/svg/icon-sprite.svg#fill-Bell"></use>
                  </svg>
                </div>
                <div class="onhover-show-div notification-dropdown">
                  <h6 class="f-18 mb-0 dropdown-title">Notitications                               </h6>
                  <ul>
                    <li class="b-l-primary bg-light-primary border-4 mt-3">
                      <p class="font-primary">Delivery processing <span class="font-primary">10 min.</span></p>
                    </li>
                    <li class="b-l-secondary bg-light-secondary border-4 mt-3">
                      <p class="font-secondary">Order Complete<span class="font-secondary">1 hr</span></p>
                    </li>
                    <li class="b-l-success bg-light-success border-4 mt-3">
                      <p class="font-success">Tickets Generated<span class="font-success">3 hr</span></p>
                    </li>
                    <li class="b-l-info bg-light-info border-4 mt-3">
                      <p class="font-info">Delivery Complete<span class="font-info">6 hr</span></p>
                    </li>
                    <li><a class="f-w-700" href="private-chat.html">Check all</a></li>
                  </ul>
                </div>
              </li>
              <li class="onhover-dropdown">
                <svg>
                  <use href="../assets/svg/icon-sprite.svg#fill-star"></use>
                </svg>
                <div class="onhover-show-div bookmark-flip">
                  <div class="flip-card">
                    <div class="flip-card-inner">
                      <div class="front">
                        <h6 class="f-18 mb-0 dropdown-title">Bookmark</h6>
                        <ul class="bookmark-dropdown">
                          <li>
                            <div class="row">
                              <div class="col-4 text-center">
                                <div class="bookmark-content">
                                  <div class="bookmark-icon"><i data-feather="file-text"></i></div><span>Forms</span>
                                </div>
                              </div>
                              <div class="col-4 text-center">
                                <div class="bookmark-content">
                                  <div class="bookmark-icon"><i data-feather="user"></i></div><span>Profile</span>
                                </div>
                              </div>
                              <div class="col-4 text-center">
                                <div class="bookmark-content">
                                  <div class="bookmark-icon"><i data-feather="server"></i></div><span>Tables</span>
                                </div>
                              </div>
                            </div>
                          </li>
                          <li class="text-center"><a class="flip-btn f-w-700" id="flip-btn" href="javascript:void(0)">Add New Bookmark</a></li>
                        </ul>
                      </div>
                      <div class="back">
                        <ul>
                          <li>
                            <div class="bookmark-dropdown flip-back-content">
                              <input type="text" placeholder="search...">
                            </div>
                          </li>
                          <li><a class="f-w-700 d-block flip-back" id="flip-back" href="javascript:void(0)">Back</a></li>
                        </ul>
                      </div>
                    </div>
                  </div>
                </div>
              </li>
              <li class="cart-nav onhover-dropdown">
                <div class="cart-box">
                  <svg>
                    <use href="../assets/svg/icon-sprite.svg#fill-Buy"></use>
                  </svg>
                </div>
                <div class="cart-dropdown onhover-show-div">
                  <h6 class="f-18 mb-0 dropdown-title">Cart</h6>
                  <ul>
                    <li>
                      <div class="d-flex"><img class="img-fluid b-r-5 img-60" src="../assets/images/ecommerce/06.jpg" alt="">
                        <div class="flex-grow-1"><span>Winter T-shirt</span>
                          <h6>1 X $ 299.00</h6>
                        </div>
                        <div class="close-circle"><a href="#"><i class="fa fa-times"></i></a></div>
                      </div>
                    </li>
                    <li>
                      <div class="d-flex"><img class="img-fluid b-r-5 img-60" src="../assets/images/ecommerce/02.jpg" alt="">
                        <div class="flex-grow-1"><span>Men Shirt</span>
                          <h6>1 X $ 299.00</h6>
                        </div>
                        <div class="close-circle"><a href="#"><i class="fa fa-times"></i></a></div>
                      </div>
                    </li>
                    <li class="total">
                      <h5 class="mb-0">Subtotal :<span class="f-right">$299.00</span></h5>
                    </li>
                    <li><a class="view-cart" href="cart.html">View Cart</a><a class="view-checkout f-right" href="checkout.html">Checkout</a></li>
                  </ul>
                </div>
              </li>
              <li class="onhover-dropdown">
                <div class="message">
                  <svg>
                    <use href="../assets/svg/icon-sprite.svg#fill-message"></use>
                  </svg><span class="rounded-pill badge-secondary"> </span>
                </div>
                <div class="onhover-show-div message-dropdown">
                  <h6 class="f-18 mb-0 dropdown-title">Message                               </h6>
                  <ul>
                    <li>
                      <div class="d-flex align-items-start">
                        <div class="message-img bg-light-primary"><img src="../assets/images/user/3.jpg" alt=""></div>
                        <div class="flex-grow-1">
                          <h5 class="mb-1"><a href="email_inbox.html">Helen Walter</a></h5>
                          <p>Do you want to go see movie?</p>
                        </div>
                        <div class="notification-right"><i data-feather="x"></i></div>
                      </div>
                    </li>
                    <li>
                      <div class="d-flex align-items-start">
                        <div class="message-img bg-light-primary"><img src="../assets/images/user/6.jpg" alt=""></div>
                        <div class="flex-grow-1">
                          <h5 class="mb-1"><a href="email_inbox.html">Jason Borne</a></h5>
                          <p>Thank you for rating us.</p>
                        </div>
                        <div class="notification-right"><i data-feather="x"></i></div>
                      </div>
                    </li>
                    <li>
                      <div class="d-flex align-items-start">
                        <div class="message-img bg-light-primary"><img src="../assets/images/user/10.jpg" alt=""></div>
                        <div class="flex-grow-1">
                          <h5 class="mb-1"><a href="email_inbox.html">Sarah Loren</a></h5>
                          <p>What`s the project report update?</p>
                        </div>
                        <div class="notification-right"><i data-feather="x"></i></div>
                      </div>
                    </li>
                    <li><a class="f-w-700" href="email-application.html">Check all</a></li>
                  </ul>
                </div>
              </li>
              <li>
                <div class="mode">
                  <svg>
                    <use href="../assets/svg/icon-sprite.svg#fill-dark"></use>
                  </svg>
                </div>
              </li>
              <li class="profile-nav onhover-dropdown p-0">
                <div class="d-flex align-items-center profile-media"><img class="b-r-10 img-40" src="../assets/images/dashboard/profile.png" alt="">
                  <div class="flex-grow-1"><span>Helen Walter</span>
                    <p class="mb-0">Admin <i class="middle fa fa-angle-down"></i></p>
                  </div>
                </div>
                <ul class="profile-dropdown onhover-show-div">
                  <li><a href="user-profile.html"><i data-feather="user"></i><span>Account </span></a></li>
                  <li><a href="email-application.html"><i data-feather="mail"></i><span>Inbox</span></a></li>
                  <li><a href="task.html"><i data-feather="file-text"></i><span>Taskboard</span></a></li>
                  <li><a href="edit-profile.html"><i data-feather="settings"></i><span>Settings</span></a></li>
                  <li><a href="login.html"><i data-feather="log-in"> </i><span>Log in</span></a></li>
                </ul>
              </li>
            </ul>
          </div>
          <script class="result-template" type="text/x-handlebars-template">
            <div class="ProfileCard u-cf">                        
            <div class="ProfileCard-avatar"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-airplay m-0"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path><polygon points="12 15 17 21 7 21 12 15"></polygon></svg></div>
            <div class="ProfileCard-details">
            <div class="ProfileCard-realName">{{name}}</div>
            </div>
            </div>
          </script>
          <script class="empty-template" type="text/x-handlebars-template"><div class="EmptyMessage">Your search turned up 0 results. This most likely means the backend is down, yikes!</div></script>
        </div>
      </div>
      <!-- Page Header Ends-->
      <!-- Page Body Start-->
      <div class="page-body-wrapper">
        <!-- Page Sidebar Start-->
        <div class="sidebar-wrapper" data-layout="fill-svg">
          <div>
            <div class="logo-wrapper"><a href="index.html"><img class="img-fluid" src="../assets/images/logo/logo.png" alt=""></a>
              <div class="toggle-sidebar">
                <svg class="sidebar-toggle"> 
                  <use href="../assets/svg/icon-sprite.svg#toggle-icon"></use>
                </svg>
              </div>
            </div>
            <div class="logo-icon-wrapper"><a href="index.html"><img class="img-fluid" src="../assets/images/logo/logo-icon.png" alt=""></a></div>
            <nav class="sidebar-main">
              <div class="left-arrow" id="left-arrow"><i data-feather="arrow-left"></i></div>
              <div id="sidebar-menu">
                <ul class="sidebar-links" id="simple-bar">
                  <li class="back-btn"><a href="index.html"><img class="img-fluid" src="../assets/images/logo/logo-icon.png" alt=""></a>
                    <div class="mobile-back text-end"><span>Back</span><i class="fa fa-angle-right ps-2" aria-hidden="true"></i></div>
                  </li>
                  <li class="pin-title sidebar-main-title">
                    <div> 
                      <h6>Pinned</h6>
                    </div>
                  </li>
                  <li class="sidebar-main-title">
                    <div>
                      <h6 class="lan-1">General</h6>
                    </div>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-home"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-home"></use>
                      </svg><span class="lan-3">Dashboard          </span></a>
                    <ul class="sidebar-submenu">
                      <li><a class="lan-4" href="index.html">Default</a></li>
                      <li><a class="lan-5" href="dashboard-02.html">Ecommerce</a></li>
                      <li><a href="dashboard-03.html">Project</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-widget"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-widget"></use>
                      </svg><span class="lan-6">Widgets</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="general-widget.html">General</a></li>
                      <li><a href="chart-widget.html">Chart</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-layout"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-layout"></use>
                      </svg><span class="lan-7">Page layout</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="box-layout.html">Boxed</a></li>
                      <li><a href="layout-rtl.html">RTL</a></li>
                      <li><a href="layout-dark.html">Dark Layout</a></li>
                      <li><a href="hide-on-scroll.html">Hide Nav Scroll</a></li>
                      <li><a href="footer-light.html">Footer Light</a></li>
                      <li><a href="footer-dark.html">Footer Dark</a></li>
                      <li><a href="footer-fixed.html">Footer Fixed</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-main-title">
                    <div>
                      <h6 class="lan-8">Applications</h6>
                    </div>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack">    </i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-project"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-project"></use>
                      </svg><span>Project           </span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="projects.html">Project List</a></li>
                      <li><a href="projectcreate.html">Create new</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="file-manager.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-file"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-file"></use>
                      </svg><span>File manager</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack">        </i><a class="sidebar-link sidebar-title link-nav" href="kanban.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-board"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-board"></use>
                      </svg><span>kanban Board</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-ecommerce"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-ecommerce"></use>
                      </svg><span>Ecommerce</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="add-products.html">Add Product</a></li>
                      <li><a href="product.html">Product</a></li>
                      <li><a href="product-page.html">Product page</a></li>
                      <li><a href="list-products.html">Product list</a></li>
                      <li><a href="payment-details.html">Payment Details</a></li>
                      <li><a href="order-history.html">Order History</a></li>
                      <li><a class="submenu-title" href="#">Invoices
                          <h5 class="sub-arrow"><i class="fa fa-angle-right"></i></h5></a>
                        <ul class="submenu-content opensubmegamenu">
                          <li><a href="invoice-1.html">Invoice-1</a></li>
                          <li><a href="invoice-2.html">Invoice-2</a></li>
                          <li><a href="invoice-3.html">Invoice-3</a></li>
                          <li><a href="invoice-4.html">Invoice-4</a></li>
                          <li><a href="invoice-5.html">Invoice-5</a></li>
                          <li><a href="invoice-template.html">Invoice-6</a></li>
                        </ul>
                      </li>
                      <li><a href="cart.html">Cart</a></li>
                      <li><a href="list-wish.html">Wishlist</a></li>
                      <li><a href="checkout.html">Checkout</a></li>
                      <li><a href="pricing.html">Pricing          </a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-email"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-email"></use>
                      </svg><span>Email</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="email-application.html">Email App</a></li>
                      <li><a href="email-compose.html">Email Compose</a></li>
                      <li><a href="letter-box.html">Letter Box</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-chat"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-chat"></use>
                      </svg><span>Chat</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="private-chat.html">Private Chat</a></li>
                      <li><a href="group-chat.html">Group Chat</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-user"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-user"></use>
                      </svg><span>Users</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="user-profile.html">Users Profile</a></li>
                      <li><a href="edit-profile.html">Users Edit</a></li>
                      <li><a href="user-cards.html">Users Cards</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="bookmark.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-bookmark"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-bookmark"> </use>
                      </svg><span>Bookmarks</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="contacts.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-contact"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-contact"> </use>
                      </svg><span>Contacts</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="task.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-task"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-task"> </use>
                      </svg><span>Tasks</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="calendar-basic.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-calendar"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-calender"></use>
                      </svg><span>Calendar</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="social-app.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-social"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-social"> </use>
                      </svg><span>Social App</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="to-do.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-to-do"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-to-do"> </use>
                      </svg><span>To-Do</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="search.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-search"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-search"> </use>
                      </svg><span>Search Result</span></a></li>
                  <li class="sidebar-main-title">
                    <div>
                      <h6>Forms & Table</h6>
                    </div>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-form"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-form"> </use>
                      </svg><span>Forms</span></a>
                    <ul class="sidebar-submenu">
                      <li><a class="submenu-title" href="#">Form Controls
                          <h5 class="sub-arrow"><i class="fa fa-angle-right"></i></h5></a>
                        <ul class="submenu-content opensubmegamenu">
                          <li><a href="form-validation.html">Form Validation</a></li>
                          <li><a href="base-input.html">Base Inputs</a></li>
                          <li><a href="radio-checkbox-control.html">Checkbox & Radio</a></li>
                          <li><a href="input-group.html">Input Groups</a></li>
                          <li> <a href="input-mask.html">Input Mask</a></li>
                          <li><a href="megaoptions.html">Mega Options</a></li>
                        </ul>
                      </li>
                      <li><a class="submenu-title" href="#">Form Widgets
                          <h5 class="sub-arrow"><i class="fa fa-angle-right"></i></h5></a>
                        <ul class="submenu-content opensubmegamenu">
                          <li><a href="datepicker.html">Datepicker</a></li>
                          <li><a href="touchspin.html">Touchspin</a></li>
                          <li><a href="select2.html">Select2</a></li>
                          <li><a href="switch.html">Switch</a></li>
                          <li><a href="typeahead.html">Typeahead</a></li>
                          <li><a href="clipboard.html">Clipboard</a></li>
                        </ul>
                      </li>
                      <li><a class="submenu-title" href="#">Form layout
                          <h5 class="sub-arrow"><i class="fa fa-angle-right"></i></h5></a>
                        <ul class="submenu-content opensubmegamenu">
                          <li><a href="form-wizard.html">Form Wizard 1</a></li>
                          <li><a href="form-wizard-two.html">Form Wizard 2</a></li>
                          <li><a href="two-factor.html">Two Factor</a></li>
                        </ul>
                      </li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-table"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-table"></use>
                      </svg><span>Tables</span></a>
                    <ul class="sidebar-submenu">
                      <li><a class="submenu-title" href="#">Bootstrap Tables
                          <h5 class="sub-arrow"><i class="fa fa-angle-right"></i></h5></a>
                        <ul class="submenu-content opensubmegamenu">
                          <li><a href="bootstrap-basic-table.html">Basic Tables</a></li>
                          <li><a href="table-components.html">Table components</a></li>
                        </ul>
                      </li>
                      <li><a class="submenu-title" href="#">Data Tables
                          <h5 class="sub-arrow"><i class="fa fa-angle-right"></i></h5></a>
                        <ul class="submenu-content opensubmegamenu">
                          <li><a href="datatable-basic-init.html">Basic Init</a></li>
                          <li> <a href="datatable-advance.html">Advance Init </a></li>
                          <li><a href="datatable-API.html">API</a></li>
                          <li><a href="datatable-data-source.html">Data Sources</a></li>
                        </ul>
                      </li>
                      <li><a href="datatable-ext-autofill.html">Ex. Data Tables</a></li>
                      <li><a href="jsgrid-table.html">Js Grid Table        </a></li>
                    </ul>
                  </li>
                  <li class="sidebar-main-title">
                    <div>
                      <h6>Components</h6>
                    </div>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-ui-kits"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-ui-kits"></use>
                      </svg><span>Ui Kits</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="typography.html">Typography</a></li>
                      <li><a href="avatars.html">Avatars</a></li>
                      <li><a href="helper-classes.html">helper classes</a></li>
                      <li><a href="grid.html">Grid</a></li>
                      <li><a href="tag-pills.html">Tag & pills</a></li>
                      <li><a href="progress-bar.html">Progress</a></li>
                      <li><a href="modal.html">Modal</a></li>
                      <li><a href="alert.html">Alert</a></li>
                      <li><a href="popover.html">Popover</a></li>
                      <li><a href="tooltip.html">Tooltip</a></li>
                      <li><a href="dropdown.html">Dropdown</a></li>
                      <li><a href="according.html">Accordion</a></li>
                      <li><a href="tab-bootstrap.html">Tabs</a></li>
                      <li><a href="list.html">Lists</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-bonus-kit"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-bonus-kit"></use>
                      </svg><span>Bonus Ui</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="scrollable.html">Scrollable</a></li>
                      <li><a href="tree.html">Tree view</a></li>
                      <li><a href="toasts.html">Toasts</a></li>
                      <li><a href="rating.html">Rating</a></li>
                      <li><a href="dropzone.html">dropzone</a></li>
                      <li><a href="tour.html">Tour</a></li>
                      <li><a href="sweet-alert2.html">SweetAlert2</a></li>
                      <li><a href="modal-animated.html">Animated Modal</a></li>
                      <li><a href="owl-carousel.html">Owl Carousel</a></li>
                      <li><a href="ribbons.html">Ribbons</a></li>
                      <li><a href="pagination.html">Pagination</a></li>
                      <li><a href="breadcrumb.html">Breadcrumb</a></li>
                      <li><a href="range-slider.html">Range Slider</a></li>
                      <li><a href="image-cropper.html">Image cropper</a></li>
                      <li><a href="basic-card.html">Basic Card</a></li>
                      <li><a href="creative-card.html">Creative Card</a></li>
                      <li><a href="dragable-card.html">Draggable Card</a></li>
                      <li><a href="timeline-v-1.html">Timeline </a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-animation"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-animation"></use>
                      </svg><span>Animation</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="animate.html">Animate</a></li>
                      <li><a href="scroll-reval.html">Scroll Reveal</a></li>
                      <li><a href="AOS.html">AOS animation</a></li>
                      <li><a href="tilt.html">Tilt Animation</a></li>
                      <li><a href="wow.html">Wow Animation</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-icons"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-icons"></use>
                      </svg><span>Icons</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="flag-icon.html">Flag icon</a></li>
                      <li><a href="font-awesome.html">Fontawesome Icon</a></li>
                      <li><a href="ico-icon.html">Ico Icon</a></li>
                      <li><a href="themify-icon.html">Themify Icon</a></li>
                      <li><a href="feather-icon.html">Feather icon</a></li>
                      <li><a href="whether-icon.html">Whether Icon</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-button"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-button"></use>
                      </svg><span>Buttons</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="buttons.html">Default Style</a></li>
                      <li><a href="button-group.html">Button Group</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-charts"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-charts"></use>
                      </svg><span>Charts</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="chart-apex.html">Apex Chart</a></li>
                      <li><a href="chart-google.html">Google Chart</a></li>
                      <li><a href="chart-sparkline.html">Sparkline chart</a></li>
                      <li><a href="chart-flot.html">Flot Chart</a></li>
                      <li><a href="chart-knob.html">Knob Chart</a></li>
                      <li><a href="chart-morris.html">Morris Chart</a></li>
                      <li><a href="chartjs.html">Chartjs Chart</a></li>
                      <li><a href="chartist.html">Chartist Chart</a></li>
                      <li><a href="chart-peity.html">Peity Chart</a></li>
                      <li><a href="echarts.html">Echarts</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-main-title">
                    <div>
                      <h6>Pages</h6>
                    </div>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="landing-page.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-landing-page"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-landing-page"></use>
                      </svg><span>Landing page</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="sample-page.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-sample-page"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-sample-page"></use>
                      </svg><span>Sample page</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="translate.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-internationalization"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-internationalization"></use>
                      </svg><span>Translate</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="../starter-kit/index.html" target="_blank">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-starter-kit"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-starter-kit"></use>
                      </svg><span>Starter kit</span></a></li>
                  <li class="mega-menu sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-others"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-others"></use>
                      </svg><span>Others</span></a>
                    <div class="mega-menu-container menu-content">
                      <div class="container-fluid">
                        <div class="row">
                          <div class="col mega-box">
                            <div class="link-section">
                              <div class="submenu-title">
                                <h5>Error Page</h5>
                              </div>
                              <ul class="submenu-content opensubmegamenu">
                                <li><a href="error-400.html">Error 400</a></li>
                                <li><a href="error-401.html">Error 401</a></li>
                                <li><a href="error-403.html">Error 403</a></li>
                                <li><a href="error-404.html">Error 404</a></li>
                                <li><a href="error-500.html">Error 500</a></li>
                                <li><a href="error-503.html">Error 503</a></li>
                              </ul>
                            </div>
                          </div>
                          <div class="col mega-box">
                            <div class="link-section">
                              <div class="submenu-title">
                                <h5> Authentication</h5>
                              </div>
                              <ul class="submenu-content opensubmegamenu">
                                <li><a href="login.html" target="_blank">Login Simple</a></li>
                                <li><a href="login_one.html" target="_blank">Login with bg image</a></li>
                                <li><a href="login_two.html" target="_blank">Login with image two                      </a></li>
                                <li><a href="login-bs-validation.html" target="_blank">Login With validation</a></li>
                                <li><a href="login-bs-tt-validation.html" target="_blank">Login with tooltip</a></li>
                                <li><a href="login-sa-validation.html" target="_blank">Login with sweetalert</a></li>
                                <li><a href="sign-up.html" target="_blank">Register Simple</a></li>
                                <li><a href="sign-up-one.html" target="_blank">Register with Bg Image                              </a></li>
                                <li><a href="sign-up-two.html" target="_blank">Register with image two</a></li>
                                <li><a href="sign-up-wizard.html" target="_blank">Register wizard</a></li>
                                <li><a href="unlock.html">Unlock User</a></li>
                                <li><a href="forget-password.html">Forget Password</a></li>
                                <li><a href="reset-password.html">Reset Password</a></li>
                                <li><a href="maintenance.html">Maintenance</a></li>
                              </ul>
                            </div>
                          </div>
                          <div class="col mega-box">
                            <div class="link-section">
                              <div class="submenu-title">
                                <h5>Coming Soon</h5>
                              </div>
                              <ul class="submenu-content opensubmegamenu">
                                <li><a href="comingsoon.html">Coming Simple</a></li>
                                <li><a href="comingsoon-bg-video.html">Coming with Bg video</a></li>
                                <li><a href="comingsoon-bg-img.html">Coming with Bg Image</a></li>
                              </ul>
                            </div>
                          </div>
                          <div class="col mega-box">
                            <div class="link-section">
                              <div class="submenu-title">
                                <h5>Email templates</h5>
                              </div>
                              <ul class="submenu-content opensubmegamenu">
                                <li><a href="basic-template.html">Basic Email</a></li>
                                <li><a href="email-header.html">Basic With Header</a></li>
                                <li><a href="template-email.html">Ecomerce Template</a></li>
                                <li><a href="template-email-2.html">Email Template 2</a></li>
                                <li><a href="ecommerce-templates.html">Ecommerce Email</a></li>
                                <li><a href="email-order-success.html">Order Success</a></li>
                              </ul>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </li>
                  <li class="sidebar-main-title">
                    <div>
                      <h6>Miscellaneous</h6>
                    </div>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-gallery"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-gallery"></use>
                      </svg><span>Gallery</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="gallery.html">Gallery Grid</a></li>
                      <li><a href="gallery-with-description.html">Gallery Grid Desc</a></li>
                      <li><a href="gallery-masonry.html">Masonry Gallery</a></li>
                      <li><a href="masonry-gallery-with-disc.html">Masonry with Desc</a></li>
                      <li><a href="gallery-hover.html">Hover Effects</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-blog"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-blog"></use>
                      </svg><span>Blog</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="blog.html">Blog Details</a></li>
                      <li><a href="blog-single.html">Blog Single</a></li>
                      <li><a href="add-post.html">Add Post</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="faq.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-faq"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-faq"></use>
                      </svg><span>FAQ</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-job-search"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-job-search"></use>
                      </svg><span>Job Search</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="job-cards-view.html">Cards view</a></li>
                      <li><a href="job-list-view.html">List View</a></li>
                      <li><a href="job-details.html">Job Details</a></li>
                      <li><a href="job-apply.html">Apply</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-learning"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-learning"></use>
                      </svg><span>Learning</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="learning-list-view.html">Learning List</a></li>
                      <li><a href="learning-detailed.html">Detailed Course</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-maps"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-maps"></use>
                      </svg><span>Maps</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="map-js.html">Maps JS</a></li>
                      <li><a href="vector-map.html">Vector Maps</a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title" href="#">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-editors"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-editors"></use>
                      </svg><span>Editors</span></a>
                    <ul class="sidebar-submenu">
                      <li><a href="summernote.html">Summer Note</a></li>
                      <li><a href="ckeditor.html">CK editor</a></li>
                      <li><a href="simple-MDE.html">MDE editor</a></li>
                      <li><a href="ace-code-editor.html">ACE code editor </a></li>
                    </ul>
                  </li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="knowledgebase.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-knowledgebase"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-knowledgebase"></use>
                      </svg><span>Knowledgebase</span></a></li>
                  <li class="sidebar-list"><i class="fa fa-thumb-tack"></i><a class="sidebar-link sidebar-title link-nav" href="support-ticket.html">
                      <svg class="stroke-icon">
                        <use href="../assets/svg/icon-sprite.svg#stroke-support-tickets"></use>
                      </svg>
                      <svg class="fill-icon">
                        <use href="../assets/svg/icon-sprite.svg#fill-support-tickets"></use>
                      </svg><span>Support Ticket</span></a></li>
                </ul>
              </div>
              <div class="right-arrow" id="right-arrow"><i data-feather="arrow-right"></i></div>
            </nav>
          </div>
        </div>
        <!-- Page Sidebar Ends-->
        <div class="page-body">
          <div class="container-fluid">
            <div class="page-title">
              <div class="row">
                <div class="col-sm-6 ps-0">
                  <h3>Font Awesome Icon</h3>
                </div>
                <div class="col-sm-6 pe-0">
                  <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="index.html">                                       
                        <svg class="stroke-icon">
                          <use href="../assets/svg/icon-sprite.svg#stroke-home"></use>
                        </svg></a></li>
                    <li class="breadcrumb-item">Icons</li>
                    <li class="breadcrumb-item active">Font Awesome Icon</li>
                  </ol>
                </div>
              </div>
            </div>
          </div>
          <!-- Container-fluid starts-->
          <div class="container-fluid">
            <div class="row">
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0"><span>20</span> Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bluetooth"></i> fa fa-bluetooth</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bluetooth-b"></i> fa fa-bluetooth-b</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-codiepie"></i> fa fa-codiepie</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-credit-card-alt"></i>fa fa-credit-card-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-edge"></i>fa fa-edge</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fort-awesome"></i>fa fa-fort-awesome</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hashtag"></i>fa fa-hashtag</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mixcloud"></i>fa fa-mixcloud</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-modx"></i>fa fa-modx</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pause-circle"></i>fa fa-pause-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pause-circle-o"></i>fa fa-pause-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-percent"></i>fa fa-percent</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-product-hunt"></i>fa fa-product-hunt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-reddit-alien"></i>fa fa-reddit-alien</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-scribd"></i>fa fa-scribd</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-shopping-bag"></i>fa fa-shopping-bag</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-shopping-basket"></i>fa fa-shopping-basket</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stop-circle"></i>fa fa-stop-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stop-circle-o"></i>fa fa-stop-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-usb"></i>fa fa-usb</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Currency Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bitcoin"></i> fa-bitcoin<span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-btc"></i> fa-btc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cny"></i> fa-cny<span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dollar"></i> fa-dollar <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-eur"></i> fa-eur</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-euro"></i> fa-euro <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gbp"></i> fa-gbp</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-inr"></i> fa-inr</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-jpy"></i> fa-jpy</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-krw"></i> fa-krw</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-money"></i> fa-money</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rmb"></i> fa-rmb <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rouble"></i> fa-rouble <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rub"></i> fa-rub</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ruble"></i> fa-ruble <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rupee"></i> fa-rupee <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-try"></i> fa-try</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-turkish-lira"></i> fa-turkish-lira <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-usd"></i> fa-usd</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-won"></i> fa-won <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-yen"></i> fa-yen <span class="text-muted">(alias)</span></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Web App Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-adjust"></i> fa-adjust</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-anchor"></i> fa-anchor</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-archive"></i> fa-archive</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows"></i> fa-arrows</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows-h"></i> fa-arrows-h</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows-v"></i> fa-arrows-v</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-asterisk"></i> fa-asterisk</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-automobile"></i> fa-automobile <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ban"></i> fa-ban</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bank"></i> fa-bank <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bar-chart-o"></i> fa-bar-chart-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-barcode"></i> fa-barcode</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bars"></i> fa-bars</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-beer"></i> fa-beer</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bell"></i> fa-bell</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bell-o"></i> fa-bell-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bolt"></i> fa-bolt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bomb"></i> fa-bomb</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-book"></i> fa-book</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bookmark"></i> fa-bookmark</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bookmark-o"></i> fa-bookmark-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-briefcase"></i> fa-briefcase</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bug"></i> fa-bug</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-building"></i> fa-building</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-building-o"></i> fa-building-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bullhorn"></i> fa-bullhorn</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bullseye"></i> fa-bullseye</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cab"></i> fa-cab <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-calendar"></i> fa-calendar</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-calendar-o"></i> fa-calendar-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-camera"></i> fa-camera</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-camera-retro"></i> fa-camera-retro</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-car"></i> fa-car</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-down"></i> fa-caret-square-o-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-left"></i> fa-caret-square-o-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-right"></i> fa-caret-square-o-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-up"></i> fa-caret-square-o-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-certificate"></i> fa-certificate</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check"></i> fa-check</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check-circle"></i> fa-check-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check-circle-o"></i> fa-check-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check-square"></i> fa-check-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check-square-o"></i> fa-check-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-child"></i> fa-child</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-circle"></i> fa-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-circle-o"></i> fa-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-circle-o-notch"></i> fa-circle-o-notch</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-circle-thin"></i> fa-circle-thin</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-clock-o"></i> fa-clock-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cloud"></i> fa-cloud</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cloud-download"></i> fa-cloud-download</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cloud-upload"></i> fa-cloud-upload</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-code"></i> fa-code</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-code-fork"></i> fa-code-fork</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-coffee"></i> fa-coffee</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cog"></i> fa-cog</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cogs"></i> fa-cogs</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-comment"></i> fa-comment</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-comment-o"></i> fa-comment-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-comments"></i> fa-comments</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-comments-o"></i> fa-comments-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-compass"></i> fa-compass</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-credit-card"></i> fa-credit-card</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-crop"></i> fa-crop</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-crosshairs"></i> fa-crosshairs</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cube"></i> fa-cube</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cubes"></i> fa-cubes</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cutlery"></i> fa-cutlery</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dashboard"></i> fa-dashboard <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-database"></i> fa-database</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-desktop"></i> fa-desktop</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dot-circle-o"></i> fa-dot-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-download"></i> fa-download</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-edit"></i> fa-edit <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ellipsis-h"></i> fa-ellipsis-h</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ellipsis-v"></i> fa-ellipsis-v</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-envelope"></i> fa-envelope</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-envelope-o"></i> fa-envelope-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-envelope-square"></i> fa-envelope-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-eraser"></i> fa-eraser</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-exchange"></i> fa-exchange</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-exclamation"></i> fa-exclamation</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-exclamation-circle"></i> fa-exclamation-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-exclamation-triangle"></i> fa-exclamation-triangle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-external-link"></i> fa-external-link</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-external-link-square"></i> fa-external-link-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-eye"></i> fa-eye</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-eye-slash"></i> fa-eye-slash</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fax"></i> fa-fax</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-female"></i> fa-female</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fighter-jet"></i> fa-fighter-jet</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-archive-o"></i> fa-file-archive-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-audio-o"></i> fa-file-audio-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-code-o"></i> fa-file-code-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-excel-o"></i> fa-file-excel-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-image-o"></i> fa-file-image-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-movie-o"></i> fa-file-movie-o <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-pdf-o"></i> fa-file-pdf-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-photo-o"></i> fa-file-photo-o <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-picture-o"></i> fa-file-picture-o <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-powerpoint-o"></i> fa-file-powerpoint-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-sound-o"></i> fa-file-sound-o <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-video-o"></i> fa-file-video-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-word-o"></i> fa-file-word-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-zip-o"></i> fa-file-zip-o <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-film"></i> fa-film</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-filter"></i> fa-filter</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fire"></i> fa-fire</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fire-extinguisher"></i> fa-fire-extinguisher</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-flag"></i> fa-flag</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-flag-checkered"></i> fa-flag-checkered</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-flag-o"></i> fa-flag-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-flash"></i> fa-flash <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-flask"></i> fa-flask</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-folder"></i> fa-folder</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-folder-o"></i> fa-folder-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-folder-open"></i> fa-folder-open</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-folder-open-o"></i> fa-folder-open-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-frown-o"></i> fa-frown-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gamepad"></i> fa-gamepad</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gavel"></i> fa-gavel</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gear"></i> fa-gear <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gears"></i> fa-gears <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gift"></i> fa-gift</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-glass"></i> fa-glass</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-globe"></i> fa-globe</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-graduation-cap"></i> fa-graduation-cap</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-group"></i> fa-group <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hdd-o"></i> fa-hdd-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-headphones"></i> fa-headphones</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-heart"></i> fa-heart</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-heart-o"></i> fa-heart-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-history"></i> fa-history</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-home"></i> fa-home</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-image"></i> fa-image <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-inbox"></i> fa-inbox</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-info"></i> fa-info</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-info-circle"></i> fa-info-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-institution"></i> fa-institution <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-key"></i> fa-key</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-keyboard-o"></i> fa-keyboard-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-language"></i> fa-language</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-laptop"></i> fa-laptop</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-leaf"></i> fa-leaf</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-legal"></i> fa-legal <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-lemon-o"></i> fa-lemon-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-level-down"></i> fa-level-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-level-up"></i> fa-level-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-life-bouy"></i> fa-life-bouy <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-life-ring"></i> fa-life-ring</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-life-saver"></i> fa-life-saver <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-lightbulb-o"></i> fa-lightbulb-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-location-arrow"></i> fa-location-arrow</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-lock"></i> fa-lock</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-magic"></i> fa-magic</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-magnet"></i> fa-magnet</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mail-forward"></i> fa-mail-forward <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mail-reply"></i> fa-mail-reply <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mail-reply-all"></i> fa-mail-reply-all <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-male"></i> fa-male</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-map-marker"></i> fa-map-marker</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-meh-o"></i> fa-meh-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-microphone"></i> fa-microphone</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-microphone-slash"></i> fa-microphone-slash</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-minus"></i> fa-minus</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-minus-circle"></i> fa-minus-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-minus-square"></i> fa-minus-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-minus-square-o"></i> fa-minus-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mobile"></i> fa-mobile</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mobile-phone"></i> fa-mobile-phone <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-money"></i> fa-money</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-moon-o"></i> fa-moon-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-mortar-board"></i> fa-mortar-board <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-music"></i> fa-music</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-navicon"></i> fa-navicon <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-paper-plane"></i> fa-paper-plane</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-paper-plane-o"></i> fa-paper-plane-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-paw"></i> fa-paw</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pencil"></i> fa-pencil</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pencil-square"></i> fa-pencil-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pencil-square-o"></i> fa-pencil-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-phone"></i> fa-phone</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-phone-square"></i> fa-phone-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-photo"></i> fa-photo <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-picture-o"></i> fa-picture-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plane"></i> fa-plane</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus"></i> fa-plus</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus-circle"></i> fa-plus-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus-square"></i> fa-plus-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus-square-o"></i> fa-plus-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-power-off"></i> fa-power-off</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-print"></i> fa-print</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-puzzle-piece"></i> fa-puzzle-piece</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-qrcode"></i> fa-qrcode</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-question"></i> fa-question</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-question-circle"></i> fa-question-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-quote-left"></i> fa-quote-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-quote-right"></i> fa-quote-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-random"></i> fa-random</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-recycle"></i> fa-recycle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-refresh"></i> fa-refresh</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-reorder"></i> fa-reorder <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-reply"></i> fa-reply</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-reply-all"></i> fa-reply-all</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-retweet"></i> fa-retweet</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-road"></i> fa-road</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rocket"></i> fa-rocket</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rss"></i> fa-rss</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rss-square"></i> fa-rss-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-search"></i> fa-search</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-search-minus"></i> fa-search-minus</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-search-plus"></i> fa-search-plus</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-send"></i> fa-send <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-send-o"></i> fa-send-o <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share"></i> fa-share</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share-alt"></i> fa-share-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share-alt-square"></i> fa-share-alt-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share-square"></i> fa-share-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share-square-o"></i> fa-share-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-shield"></i> fa-shield</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-shopping-cart"></i> fa-shopping-cart</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sign-in"></i> fa-sign-in</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sign-out"></i> fa-sign-out</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-signal"></i> fa-signal</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sitemap"></i> fa-sitemap</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sliders"></i> fa-sliders</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-smile-o"></i> fa-smile-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort"></i> fa-sort</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-alpha-asc"></i> fa-sort-alpha-asc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-alpha-desc"></i> fa-sort-alpha-desc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-amount-asc"></i> fa-sort-amount-asc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-amount-desc"></i> fa-sort-amount-desc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-asc"></i> fa-sort-asc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-desc"></i> fa-sort-desc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-down"></i> fa-sort-down <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-numeric-asc"></i> fa-sort-numeric-asc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-numeric-desc"></i> fa-sort-numeric-desc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sort-up"></i> fa-sort-up <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-space-shuttle"></i> fa-space-shuttle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spinner"></i> fa-spinner</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spoon"></i> fa-spoon</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-square"></i> fa-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-square-o"></i> fa-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-star"></i> fa-star</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-star-half"></i> fa-star-half</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-star-half-empty"></i> fa-star-half-empty <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-star-half-full"></i> fa-star-half-full <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-star-half-o"></i> fa-star-half-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-star-o"></i> fa-star-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-suitcase"></i> fa-suitcase</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-sun-o"></i> fa-sun-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-support"></i> fa-support <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tablet"></i> fa-tablet</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tachometer"></i> fa-tachometer</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tag"></i> fa-tag</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tags"></i> fa-tags</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tasks"></i> fa-tasks</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-taxi"></i> fa-taxi</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-terminal"></i> fa-terminal</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-thumb-tack"></i> fa-thumb-tack</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-thumbs-down"></i> fa-thumbs-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-thumbs-o-down"></i> fa-thumbs-o-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-thumbs-o-up"></i> fa-thumbs-o-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-thumbs-up"></i> fa-thumbs-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ticket"></i> fa-ticket</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-times"></i> fa-times</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-times-circle"></i> fa-times-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-times-circle-o"></i> fa-times-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tint"></i> fa-tint</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-down"></i> fa-toggle-down <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-left"></i> fa-toggle-left <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-right"></i> fa-toggle-right <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-up"></i> fa-toggle-up <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-trash-o"></i> fa-trash-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tree"></i> fa-tree</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-trophy"></i> fa-trophy</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-truck"></i> fa-truck</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-umbrella"></i> fa-umbrella</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-university"></i> fa-university</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-unlock"></i> fa-unlock</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-unlock-alt"></i> fa-unlock-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-unsorted"></i> fa-unsorted <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-upload"></i> fa-upload</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-user"></i> fa-user</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-users"></i> fa-users</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-video-camera"></i> fa-video-camera</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-volume-down"></i> fa-volume-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-volume-off"></i> fa-volume-off</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-volume-up"></i> fa-volume-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-warning"></i> fa-warning <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-wheelchair"></i> fa-wheelchair</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-wrench"></i> fa-wrench</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Spinner Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spin fa-circle-o-notch"></i> fa-circle-o-notch</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spin fa-cog"></i> fa-cog</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spin fa-gear"></i> fa-gear <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spin fa-refresh"></i> fa-refresh</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spin fa-spinner"></i> fa-spinner</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Form Control Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check-square"></i> fa-check-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-check-square-o"></i> fa-check-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-circle"></i> fa-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-circle-o"></i> fa-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dot-circle-o"></i> fa-dot-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-minus-square"></i> fa-minus-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-minus-square-o"></i> fa-minus-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus-square"></i> fa-plus-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus-square-o"></i> fa-plus-square-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-square"></i> fa-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-square-o"></i> fa-square-o</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Text Editor Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-align-center"></i> fa-align-center</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-align-justify"></i> fa-align-justify</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-align-left"></i> fa-align-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-align-right"></i> fa-align-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bold"></i> fa-bold</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chain"></i> fa-chain <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chain-broken"></i> fa-chain-broken</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-clipboard"></i> fa-clipboard</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-columns"></i> fa-columns</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-copy"></i> fa-copy <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-cut"></i> fa-cut <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dedent"></i> fa-dedent <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-eraser"></i> fa-eraser</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file"></i> fa-file</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-o"></i> fa-file-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-text"></i> fa-file-text</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-file-text-o"></i> fa-file-text-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-files-o"></i> fa-files-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-floppy-o"></i> fa-floppy-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-font"></i> fa-font</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-header"></i> fa-header</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-indent"></i> fa-indent</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-italic"></i> fa-italic</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-link"></i> fa-link</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-list"></i> fa-list</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-list-alt"></i> fa-list-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-list-ol"></i> fa-list-ol</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-list-ul"></i> fa-list-ul</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-outdent"></i> fa-outdent</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-paperclip"></i> fa-paperclip</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-paragraph"></i> fa-paragraph</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-paste"></i> fa-paste <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-repeat"></i> fa-repeat</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rotate-left"></i> fa-rotate-left <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rotate-right"></i> fa-rotate-right <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-save"></i> fa-save <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-scissors"></i> fa-scissors</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-strikethrough"></i> fa-strikethrough</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-subscript"></i> fa-subscript</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-superscript"></i> fa-superscript</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-table"></i> fa-table</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-text-height"></i> fa-text-height</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-text-width"></i> fa-text-width</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-th"></i> fa-th</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-th-large"></i> fa-th-large</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-th-list"></i> fa-th-list</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-underline"></i> fa-underline</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-undo"></i> fa-undo</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-unlink"></i> fa-unlink <span class="text-muted">(alias)</span></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Directional Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-double-down"></i> fa-angle-double-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-double-left"></i> fa-angle-double-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-double-right"></i> fa-angle-double-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-double-up"></i> fa-angle-double-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-down"></i> fa-angle-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-left"></i> fa-angle-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-right"></i> fa-angle-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-angle-up"></i> fa-angle-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-down"></i> fa-arrow-circle-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-left"></i> fa-arrow-circle-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-o-down"></i> fa-arrow-circle-o-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-o-left"></i> fa-arrow-circle-o-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-o-right"></i> fa-arrow-circle-o-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-o-up"></i> fa-arrow-circle-o-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-right"></i> fa-arrow-circle-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-circle-up"></i> fa-arrow-circle-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-down"></i> fa-arrow-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-left"></i> fa-arrow-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-right"></i> fa-arrow-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrow-up"></i> fa-arrow-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows"></i> fa-arrows</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows-alt"></i> fa-arrows-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows-h"></i> fa-arrows-h</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows-v"></i> fa-arrows-v</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-down"></i> fa-caret-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-left"></i> fa-caret-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-right"></i> fa-caret-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-up"></i> fa-caret-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-left"></i> fa-caret-square-o-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-right"></i> fa-caret-square-o-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-up"></i> fa-caret-square-o-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-caret-square-o-down"></i> fa-caret-square-o-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-circle-down"></i> fa-chevron-circle-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-circle-left"></i> fa-chevron-circle-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-circle-right"></i> fa-chevron-circle-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-circle-up"></i> fa-chevron-circle-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-down"></i> fa-chevron-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-left"></i> fa-chevron-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-right"></i> fa-chevron-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-chevron-up"></i> fa-chevron-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hand-o-down"></i> fa-hand-o-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hand-o-left"></i> fa-hand-o-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hand-o-right"></i> fa-hand-o-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hand-o-up"></i> fa-hand-o-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-long-arrow-down"></i> fa-long-arrow-down</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-long-arrow-left"></i> fa-long-arrow-left</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-long-arrow-right"></i> fa-long-arrow-right</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-long-arrow-up"></i> fa-long-arrow-up</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-down"></i> fa-toggle-down <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-left"></i> fa-toggle-left <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-right"></i> fa-toggle-right <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-toggle-up"></i> fa-toggle-up <span class="text-muted">(alias)</span></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Video Player Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-arrows-alt"></i> fa-arrows-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-backward"></i> fa-backward</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-compress"></i> fa-compress</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-eject"></i> fa-eject</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-expand"></i> fa-expand</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fast-backward"></i> fa-fast-backward</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-fast-forward"></i> fa-fast-forward</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-forward"></i> fa-forward</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pause"></i> fa-pause</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-play"></i> fa-play</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-play-circle"></i> fa-play-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-play-circle-o"></i> fa-play-circle-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-step-backward"></i> fa-step-backward</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-step-forward"></i> fa-step-forward</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stop"></i> fa-stop</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-youtube-play"></i> fa-youtube-play</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Brand Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-adn"></i> fa-adn</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-android"></i> fa-android</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-apple"></i> fa-apple</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-behance"></i> fa-behance</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-behance-square"></i> fa-behance-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bitbucket"></i> fa-bitbucket</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bitbucket-square"></i> fa-bitbucket-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-bitcoin"></i> fa-bitcoin <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-btc"></i> fa-btc</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-codepen"></i> fa-codepen</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-css3"></i> fa-css3</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-delicious"></i> fa-delicious</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-deviantart"></i> fa-deviantart</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-digg"></i> fa-digg</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dribbble"></i> fa-dribbble</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-dropbox"></i> fa-dropbox</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-drupal"></i> fa-drupal</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-empire"></i> fa-empire</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-facebook"></i> fa-facebook</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-facebook-square"></i> fa-facebook-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-flickr"></i> fa-flickr</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-foursquare"></i> fa-foursquare</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ge"></i> fa-ge <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-git"></i> fa-git</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-git-square"></i> fa-git-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-github"></i> fa-github</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-github-alt"></i> fa-github-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-github-square"></i> fa-github-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-gittip"></i> fa-gittip</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-google"></i> fa-google</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-google-plus"></i> fa-google-plus</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-google-plus-square"></i> fa-google-plus-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hacker-news"></i> fa-hacker-news</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-html5"></i> fa-html5</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-instagram"></i> fa-instagram</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-joomla"></i> fa-joomla</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-jsfiddle"></i> fa-jsfiddle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-linkedin"></i> fa-linkedin</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-linkedin-square"></i> fa-linkedin-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-linux"></i> fa-linux</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-maxcdn"></i> fa-maxcdn</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-openid"></i> fa-openid</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pagelines"></i> fa-pagelines</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pied-piper"></i> fa-pied-piper</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pied-piper-alt"></i> fa-pied-piper-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pinterest"></i> fa-pinterest</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-pinterest-square"></i> fa-pinterest-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-qq"></i> fa-qq</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ra"></i> fa-ra <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-rebel"></i> fa-rebel</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-reddit"></i> fa-reddit</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-reddit-square"></i> fa-reddit-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-renren"></i> fa-renren</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share-alt"></i> fa-share-alt</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-share-alt-square"></i> fa-share-alt-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-skype"></i> fa-skype</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-slack"></i> fa-slack</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-soundcloud"></i> fa-soundcloud</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-spotify"></i> fa-spotify</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stack-exchange"></i> fa-stack-exchange</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stack-overflow"></i> fa-stack-overflow</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-steam"></i> fa-steam</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-steam-square"></i> fa-steam-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stumbleupon"></i> fa-stumbleupon</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stumbleupon-circle"></i> fa-stumbleupon-circle</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tencent-weibo"></i> fa-tencent-weibo</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-trello"></i> fa-trello</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tumblr"></i> fa-tumblr</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-tumblr-square"></i> fa-tumblr-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-twitter"></i> fa-twitter</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-twitter-square"></i> fa-twitter-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-vimeo-square"></i> fa-vimeo-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-vine"></i> fa-vine</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-vk"></i> fa-vk</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-wechat"></i> fa-wechat <span class="text-muted">(alias)</span></div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-weibo"></i> fa-weibo</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-weixin"></i> fa-weixin</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-windows"></i> fa-windows</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-wordpress"></i> fa-wordpress</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-xing"></i> fa-xing</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-xing-square"></i> fa-xing-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-yahoo"></i> fa-yahoo</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-youtube"></i> fa-youtube</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-youtube-play"></i> fa-youtube-play</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-youtube-square"></i> fa-youtube-square</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header pb-0">
                    <h3 class="m-b-0">Medical Icons</h3>
                  </div>
                  <div class="card-body">
                    <div class="row icon-lists">
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-ambulance"></i> fa-ambulance</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-h-square"></i> fa-h-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-hospital-o"></i> fa-hospital-o</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-medkit"></i> fa-medkit</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-plus-square"></i> fa-plus-square</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-stethoscope"></i> fa-stethoscope</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-user-md"></i> fa-user-md</div>
                      <div class="col-sm-6 col-md-4 col-xl-3"><i class="fa fa-wheelchair"></i> fa-wheelchair</div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- Container-fluid Ends-->
        </div>
        <!-- footer start-->
        <footer class="footer">
          <div class="container-fluid">
            <div class="row">
              <div class="col-md-6 p-0 footer-copyright">
                <p class="mb-0">Copyright 2023 © Dunzo theme by <a href="Http://www.bootstrapmb.com">bootstrapMB</a></p>
              </div>
              <div class="col-md-6 p-0">
                <p class="heart mb-0">Hand crafted &amp; made with
                  <svg class="footer-icon">
                    <use href="../assets/svg/icon-sprite.svg#heart"></use>
                  </svg>
                </p>
              </div>
            </div>
          </div>
        </footer>
      </div>
      <div class="icon-hover-bottom p-fixed fa-fa-icon-show-div opecity-0">
        <div class="container-fluid">
          <div class="row">
            <div class="icon-popup">
              <div class="close-icon"><i class="icofont icofont-close"></i></div>
              <div class="icon-first"><i class="icon-drupal fa-2x" id="icon_main"></i></div>
              <div class="icon-class">
                <label class="icon-title">Class</label><span id="fclass1">icon-drupal</span>
              </div>
              <div class="icon-last icon-last">
                <label class="icon-title">Markup</label>
                <div class="form-inline">
                  <div class="form-group">
                    <input class="inp-val form-control m-r-10" id="input_copy" type="text" value="" readonly="readonly">
                    <button class="btn btn-primary notification" onclick="myFunction()">Copy text</button>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- latest jquery-->
    <script src="../assets/js/jquery.min.js"></script>
    <!-- Bootstrap js-->
    <script src="../assets/js/bootstrap/bootstrap.bundle.min.js"></script>
    <!-- feather icon js-->
    <script src="../assets/js/icons/feather-icon/feather.min.js"></script>
    <script src="../assets/js/icons/feather-icon/feather-icon.js"></script>
    <!-- scrollbar js-->
    <script src="../assets/js/scrollbar/simplebar.js"></script>
    <script src="../assets/js/scrollbar/custom.js"></script>
    <!-- Sidebar jquery-->
    <script src="../assets/js/config.js"></script>
    <!-- Plugins JS start-->
    <script src="../assets/js/sidebar-menu.js"></script>
    <script src="../assets/js/sidebar-pin.js"></script>
    <script src="../assets/js/slick/slick.min.js"></script>
    <script src="../assets/js/slick/slick.js"></script>
    <script src="../assets/js/header-slick.js"></script>
    <script src="../assets/js/notify/bootstrap-notify.min.js"></script>
    <script src="../assets/js/icons/icons-notify.js"></script>
    <script src="../assets/js/icons/icon-clipart.js"></script>
    <!-- Plugins JS Ends-->
    <!-- Theme js-->
    <script src="../assets/js/script.js"></script>
    <script src="../assets/js/theme-customizer/customizer.js"></script>
    <!-- Plugin used-->
  </body>
</html>